<template>
    <Form ref="form" :model="data" :rules="rules" inline>
      <FormItem>
         <DatePicker type="year" :start-date="startDate" :options="dateOption" v-width="150" v-model="data.date" placeholder="请选择年份" element-id="date" />
      </FormItem>
      <FormItem>
<Input v-model="data.name" v-width="235" placeholder="请输入患者姓名/手机号/诊疗号" element-id="name" />
      </FormItem>
                  <FormItem>
          <Select v-model="data.room" v-width="100" placeholder="诊室" element-id="personnel" :clearable="true">
                        <Option :value="0">一诊</Option>
                        <Option :value="1">二诊</Option>
                        <Option :value="2">三诊</Option>
                    </Select>
      </FormItem>
            <FormItem>
          <Select v-model="data.personnel" v-width="100" placeholder="所属医助" element-id="personnel" :clearable="true">
                        <Option :value="0">高玲</Option>
                        <Option :value="1">王艳</Option>
                        <Option :value="2">刘志强</Option>
                    </Select>
      </FormItem>

    </Form>
</template>
<script>
    import { mapState } from 'vuex';
    export default {
        data () {
            return {
                startDate: new Date(),
                dateOption: {
                    disabledDate (pick) {
                        const curDate = new Date();
                        let reVal = 0;
                        if (pick > curDate) {
                            reVal = 1;
                        }
                        return reVal;
                    }
                },
                cityList: [
                    {
                        value: '在乎费用',
                        label: '在乎费用'
                    },
                    {
                        value: '专家',
                        label: '专家'
                    },
                    {
                        value: '敏感',
                        label: '敏感'
                    },
                    {
                        value: '远程',
                        label: '远程'
                    }
                ],
                cityList1: [
                    {
                        value: '复诊',
                        label: '复诊'
                    },
                    {
                        value: '专家',
                        label: '专家'
                    },
                    {
                        value: '权威',
                        label: '权威'
                    }
                ],
                cityList2: [
                    {
                        value: '专家活动',
                        label: '专家活动'
                    },
                    {
                        value: '折扣活动',
                        label: '折扣活动'
                    },
                    {
                        value: '援助活动',
                        label: '援助活动'
                    }
                ],
                model7: '',
                positionList: [
                    {
                        value: '头部',
                        label: '头部'
                    },
                    {
                        value: '面部',
                        label: '面部'
                    },
                    {
                        value: '四肢',
                        label: '四肢'
                    },
                    {
                        value: '脚部',
                        label: '脚部'
                    }
                ],
                model12: [],
                model13: [],
                grid: {
                    xl: 4,
                    lg: 8,
                    md: 12,
                    sm: 24,
                    xs: 24
                },
                collapse: false,
                data: {
                    name: '',
                    date: '',
                    consultant: '',
                    personnel: '',
                    diagnosis: '',
                    treatment: '',
                    risk: ''
                },
                rules: {

                }
            }
        },
        computed: {
            ...mapState('admin/layout', [
                'isMobile'
            ]),
            labelWidth () {
                return this.isMobile ? undefined : 100;
            },
            labelPosition () {
                return this.isMobile ? 'top' : 'right';
            }
        },
        methods: {
        }
    }
</script>
